<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html>
<head>
<%@include file="../../views/layouts/header.jsp" %>
  <title>移动直播_企业直播间_全场景直播_行业场景定制直播-【乐直播官网】</title>

  <style type="text/css">
    #wrap{width:1200px;height:263px;margin:30px auto;position:relative;overflow:hidden;}
    #imglist{height:263px;position:absolute;top:0;left:-2400px;}
    .lzb-slide{float:left;width:300px;height:300px;}
    .lzb-slide .lzb-slide-img{width:300px;}
    #wrap #prev{left:20px;cursor:pointer;font-size:80px;position:absolute;top:75px;color:#ececec;}
    #wrap #next{right:20px;cursor:pointer;font-size:80px;position:absolute;top:75px;color:#ececec;}
    .swiper-container {width: 100%;height: 300px; margin: 20px auto; }
    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
    .swiper-slide img{
        float:left;
    }
  </style>
  <link rel="stylesheet" href="http://cdn.lezhibo.com/static/front/css/new-lzb.css?cdnv=0.16" type="text/css"> 
  <link rel="stylesheet" href="http://cdn.lezhibo.com/static/front/css/new-style3.css?cdnv=0.16" type="text/css"> 
  <script>
            var $leActivityId="";
            var cdnPath="http://cdn.lezhibo.com";//cdn路径
  </script>
</head> 
 <body class="stretched no-transition"> 
  <div id="wrapper" class="clearfix"> 
   <header id="header" class="full-header"> 
    <div id="header-wrap"> 
     <div class="container clearfix"> 
      <div id="primary-menu-trigger">
       <i class="icon-reorder"></i>
      </div> 
      <div id="logo"> 
       <a href="/" class="standard-logo" data-dark-logo="/static/front/images/logo-dark.png"><img src="http://cdn.lezhibo.com/static/front/images/lzb-logo4.jpg" alt="乐直播"></a> 
       <a href="/" class="retina-logo" data-dark-logo="/static/front/images/logo-dark@2x.png"><img class="shouji-logo" src="http://cdn.lezhibo.com/static/front/images/lzb-logo1@2x3.jpg" alt="乐直播"></a> 
      </div>
      <!-- #logo end --> 
<%@include file="../../views/layouts/navigation.jsp" %>
      <!-- #primary-menu end --> 
     </div> 
    </div> 
   </header>
   <!-- #header end --> 
   <div class="banner"> 
    <img src="http://cdn.lezhibo.com/static/front/images/product-banner1.jpg" alt=""> 
   </div> 
   <!--banner  end --> 
   <!--content start--> 
   <!--content1--> 
   <div class="lzb-content"> 
    <div class="wrap"> 
     <div class="content-hd"> 
      <h3 class="content-title"> 微信直播营销系统四大价值点 </h3> 
      <p>硬件/软件/云服务/VIP培训</p> 
     </div> 
     <div class="content-bt"> 
      <img src="http://cdn.lezhibo.com/static/front/images/pro-img2.png" alt="" class="width-img"> 
     </div> 
    </div> 
   </div> 
   <!--content1 end--> 
   <!--content2 start--> 
   <div class="lzb-content"> 
    <div class="wrap"> 
     <div class="content-hd"> 
      <h3 class="content-title"> 28款营销应用-自定义 </h3> 
      <p>提供多种营销应用，营销应用自由组合</p> 
     </div> 
     <div class="content-bt mgb50"> 
      <ul class="lzb-marketing fix"> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon1.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">红包</h4> 
         <p>红包利器，满满都是回头客</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon2.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">广告</h4> 
         <p>功能插件，提高收入的必备法宝</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon3.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">气氛</h4> 
         <p>成交插件，高流量多用户</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon4.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">积分</h4> 
         <p>获取信任，留住用户激发用户参与</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon5.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">公众号</h4> 
         <p>抓住用户，快速增加粉丝数量</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon6.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">商城</h4> 
         <p>促进商品销售，让顾客惊喜不断</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon7.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">语音</h4> 
         <p>互动插件，活跃气氛方便用户</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon8.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">付费</h4> 
         <p>互动插件 增加收入</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon9.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">大转盘</h4> 
         <p>促销秘籍，其乐无穷，提升销量</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon10.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">打赏</h4> 
         <p>最刺激的打赏方式，带来大批流量</p> 
        </div> </li> 
       <li class="fix"> <img src="http://cdn.lezhibo.com/static/front/images/pro-icon10.png" alt="" class="icon-img"> 
        <div class="describe-container"> 
         <h4 class="describe-title">抽奖</h4> 
         <p>增加用户互动，吸引人气</p> 
        </div> </li> 
       <!--<li class="fix">--> 
       <!--<img src="images/pro-icon12.png" alt="" class="icon-img"/>--> 
       <!--<div class="describe-container">--> 
       <!--<div class="describe-title">更多</div>--> 
       <!--</div>--> 
       <!--</li>--> 
      </ul> 
     </div> 
    </div> 
   </div> 
   <!--content2 end--> 
   <!--content3 start--> 
   <div class="lzb-content"> 
    <div class="wrap"> 
     <div class="content-hd"> 
      <h3 class="content-title"> “三大”微信直播营销系统版本 </h3> 
      <p>通过移动互联网技术，帮助客户简单、高效、一站式解决直播问题，让直播更简单</p> 
     </div> 
     <div class="content-bt"> 
      <img src="http://cdn.lezhibo.com/static/front/images/pro-img3.png" alt="" class=" lzb-third-img"> 
      <img src="http://cdn.lezhibo.com/static/front/images/pro-img4.png" alt="" class=" lzb-third-img"> 
      <img src="http://cdn.lezhibo.com/static/front/images/pro-img5.png" alt="" class=" lzb-third-img"> 
     </div> 
    </div> 
   </div> 
   <!--content3 end--> 
   <!--content4--> 
   <div class="lzb-content"> 
    <div class="wrap"> 
     <div class="content-hd"> 
      <h3 class="content-title"> 多种应用场景 </h3> 
      <p>满足多种行业的使用场景</p> 
     </div> 
     <div class="content-bt"> 
      <div id="wrap"> 
       <ul id="imglist"> 
        <li class="lzb-slide"> <a href="#section1" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-car.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-car.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section2" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-tour.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-tour.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section3" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-play.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-play.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section4" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-edu.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-edu.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section5" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-meeting.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-metting.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section6" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-finical.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-finical.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section7" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-sw.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-sw.png" alt=""> 
          </div> </a> </li> 
        <li class="lzb-slide"> <a href="#section8" class="lzb-link"> <img src="http://cdn.lezhibo.com/static/front/images/small-media.png" class="lzb-slide-img"> 
          <div class="mask"> 
           <img src="http://cdn.lezhibo.com/static/front/images/icon1-media.png" alt=""> 
          </div> </a> </li> 
       </ul> 
       <a id="prev" href="javascript:prev()">&lt;</a> 
       <a id="next" href="javascript:next()">&gt;</a> 
      </div> 
     </div> 
    </div> 
   </div> 
   <!-- main start--> 
   <div class="main-container"> 
    <div id="section1" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section1.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="left:19%;bottom:37%;">立即体验</a> 
    </div> 
    <div id="section2" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section2.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="bottom: 38%;left: 50%;">立即体验</a> 
    </div> 
    <div id="section3" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section3.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="left:19%;bottom:39%;">立即体验</a> 
    </div> 
    <div id="section4" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section4.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="bottom: 38%;left: 50%;">立即体验</a> 
    </div> 
    <div id="section5" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section5.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="left:19%;bottom:29%;">立即体验</a> 
    </div> 
    <div id="section6" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section6.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="bottom: 38%;left: 50%;">立即体验</a> 
    </div> 
    <div id="section7" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section7.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="left:19%;bottom:27%;">立即体验</a> 
    </div> 
    <div id="section8" class="pro-section"> 
     <img src="http://cdn.lezhibo.com/static/front/images/section8.png" alt=""> 
     <a href="${ctx}/cases.vo" class="lzb-btn lzb-btn-primary  lzb-btn-position" style="bottom: 38%;left: 50%;">立即体验</a> 
    </div> 
   </div> 
   <!--main end --> 
   <!-- Content=============================================end --> 
   <div class="footerBox"> 
    <footer class="footer clearfix"> 
     <!--<div class="copyright">--> 
     <!--<p>京ICP备16053982号-1</p>--> 
     <!--<p>www.lezhibo.com 2011-2015 © All Rights Reserved</p>--> 
     <!--</div>--> 
     <div class="footerlogo">
      <img src="http://cdn.lezhibo.com/static/wechat/images/footerLogo.jpg">
     </div> 
     <div class="contactUs"> 
      <span><a href="javascript:void(0);">联系我们</a></span> 
      <ul> 
       <li><a href="/">乐直播</a>（北京）网络科技有限公司<em class="ec">版权所有</em><br><a href="http://www.miitbeian.gov.cn/" title="京ICP备16053982号-5" target="_blank" rel="nofollow">京ICP备16053982号-5</a></li> 
       <li>联系电话: 400-900-5560</li> 
       <li>微信：lezhibo-lb</li> 
       <li>QQ：3254604660<em> &nbsp;&nbsp;&nbsp;邮箱:lzb@lezhibo.com</em></li> 
       <li>北京公司地址：北京朝阳区日坛北路7号1幢3层304（总部地址）</li> 
      </ul> 
     </div> 
     <div class="QRcode"> 
      <span><a href="javascript:void(0);">关注我们</a></span> 
      <em><i>微信扫一扫<br>更多精彩等着您</i><img src="http://cdn.lezhibo.com/static/wechat/images/le-qrcode.jpg" alt="微信扫一扫,更多精彩等着您"></em> 
     </div> 
    </footer>
    <!-- #footer end --> 
   </div> 
  </div>
  <!-- #wrapper end --> 
  <div id="gotoTop" class="icon-angle-up"></div> 
  <script type="text/javascript" src="http://cdn.lezhibo.com/static/front/js/functions1.js?cdnv=0.16"></script> 
  <script type="text/javascript" src="http://cdn.lezhibo.com/static/layui/layui.js?cdnv=0.16"></script> 
  <script type="text/javascript" src="http://cdn.lezhibo.com/static/layui/lay/dest/layui.all.js?cdnv=0.16"></script> 
  <script>
        var currentId = "func";
        $("#"+currentId).attr("class","current");


    var num=8;
    $('.lzb-slide').eq(0).clone().appendTo('#imglist');
    $('.lzb-slide').eq(1).clone().appendTo('#imglist');
    $('.lzb-slide').eq(2).clone().appendTo('#imglist');
    $('.lzb-slide').eq(3).clone().appendTo('#imglist');
    $('#imglist').css('width',$('.lzb-slide').length*$('.lzb-slide').width());
    function move(target){
        $('#imglist').stop().animate({'left':target},300);
    }
    function next(){
        num++;
        if(num==$(".lzb-slide").length-3){
            $('#imglist').css('left',0);
            num=1;
        }
        move(num*-$('.lzb-slide').width());
    }
    function prev(){
        num--;
        if(num<0){
            $('#imglist').css('left',-$('.lzb-slide').width()*($('.lzb-slide').length-4));
            num=$('.lzb-slide').length-5;
        }
        move(num*-$('.lzb-slide').width());
    }

    //var timer=setInterval('next()',2000);
    <!--$('#wrap').mouseover(function(){-->
        <!--clearInterval(timer);-->
    <!--}).mouseout(function(){-->
        <!--timer=setInterval('next()',2000);-->
    <!--});-->
    <!--$('i').mouseover(function(){-->
        <!--num=$(this).index();-->
        <!--move(num*-$('.lzb-slide').width());-->
        <!--$('.lzb-dots i').css('background','transparent');-->
        <!--$(this).css('background','red');-->
    <!--});-->


    var swiper = new Swiper('.swiper-container', {
        prevButton:'.swiper-button-prev',
        nextButton:'.swiper-button-next',
        slidesPerView: 4,
        paginationClickable: true,
        spaceBetween: 30,
        freeMode: true
    });





        function layerInit() {
            $("[go-href]").click(function () {
                var href = $(this).attr("go-href");
                var newWind = $(this).attr("go-href-new");
                if (newWind == "true") {
                    window.open(href);
                } else {
                    window.location.href = href;
                }
            });
        }
        layerInit();
        /**
         * 百度统计
         */
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?26c862c397ddfac8288cb68427caa70f";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();

        /**
         * 百度商桥
         */
        var _hmt1 = _hmt1 || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?9837d3382bc11d53001c82796fba0e5f";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();

        $(function(){
            $('#logo img').css('height',60);
            $('#logo').css('margin-top', 20);
        });
        $(window).scroll(function(){
            if($('body').scrollTop()>0){
                $('#logo').css('margin-top', 0);
            }else{
                $('#logo').css('margin-top', 20);
            }

        });
    </script>
 </body>
</html>
